<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" th:replace="~{fragments/layout :: layout(~{::title}, ~{::section})}">

<head>
    <title>编辑用户 - 图书馆管理系统</title>
</head>

<body>
    <section>
        <div class="d-flex justify-content-between align-items-center mb-4">
            <h2>编辑用户</h2>
            <a href="/user/list" class="btn btn-secondary">
                <i class="fas fa-arrow-left"></i> 返回列表
            </a>
        </div>

        <div class="card">
            <div class="card-body">
                <form id="editUserForm">
                    <input type="hidden" id="id" name="id" th:value="${user.id}">
                    <div class="form-group">
                        <label for="username">用户名</label>
                        <input type="text" class="form-control" id="username" name="username" th:value="${user.username}" required>
                    </div>
                    <div class="form-group">
                        <label for="password">密码</label>
                        <input type="password" class="form-control" id="password" name="password" placeholder="不修改请留空">
                    </div>
                    <div class="form-group">
                        <label for="name">姓名</label>
                        <input type="text" class="form-control" id="name" name="name" th:value="${user.name}" required>
                    </div>
                    <div class="form-group">
                        <label for="gender">性别</label>
                        <select class="form-control" id="gender" name="gender" required>
                            <option value="">请选择性别</option>
                            <option value="1" th:selected="${user.gender == 1}">男</option>
                            <option value="2" th:selected="${user.gender == 2}">女</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="phone">手机号码</label>
                        <input type="text" class="form-control" id="phone" name="phone" th:value="${user.phone}">
                    </div>
                    <div class="form-group">
                        <label for="email">邮箱</label>
                        <input type="email" class="form-control" id="email" name="email" th:value="${user.email}">
                    </div>
                    <div class="form-group">
                        <label for="role">角色</label>
                        <select class="form-control" id="role" name="role" required>
                            <option value="">请选择角色</option>
                            <option value="0" th:selected="${user.role == 0}">管理员</option>
                            <option value="1" th:selected="${user.role == 1}">普通用户</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="status">状态</label>
                        <select class="form-control" id="status" name="status" required>
                            <option value="">请选择状态</option>
                            <option value="1" th:selected="${user.status == 1}">正常</option>
                            <option value="0" th:selected="${user.status == 0}">禁用</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <button type="submit" class="btn btn-primary">
                            <i class="fas fa-save"></i> 保存
                        </button>
                        <button type="button" class="btn btn-secondary" onclick="window.location.href='/user/list'">
                            <i class="fas fa-times"></i> 取消
                        </button>
                    </div>
                </form>
            </div>
        </div>

        <script>
            $(document).ready(function () {
                $('#editUserForm').submit(function (e) {
                    e.preventDefault();
                    
                    const formData = {
                        id: $('#id').val(),
                        username: $('#username').val(),
                        name: $('#name').val(),
                        gender: $('#gender').val(),
                        phone: $('#phone').val(),
                        email: $('#email').val(),
                        role: $('#role').val(),
                        status: $('#status').val()
                    };

                    // 如果密码不为空，则添加到请求数据中
                    const password = $('#password').val();
                    if (password) {
                        formData.password = password;
                    }

                    $.ajax({
                        url: '/user/api/update',
                        type: 'PUT',
                        contentType: 'application/json',
                        data: JSON.stringify(formData),
                        success: function (res) {
                            if (res.code === 200) {
                                alert('更新成功！');
                                window.location.href = '/user/list';
                            } else {
                                alert('更新失败：' + res.message);
                            }
                        },
                        error: function () {
                            alert('服务器错误，请稍后再试！');
                        }
                    });
                });
            });
        </script>
    </section>
</body>

</html> 